<!-- 材料智能体-科学大模型-化学吸附 -->
<template>
  <div class="main-app">
    <el-page-header @back="cancel" :content="title" style="margin: 1%;"></el-page-header>
    <div style="width: 95%; margin: 1% 0 0 2%;">
      <el-form ref="form" :model="form" :rules="rules" label-width="15%" disabled>
        <el-row :gutter="20" style="margin-top: 10px">
          <el-col :span="24">
            <el-form-item label="chemsys:" prop="chemsys">
              <el-input v-model="form.chemsys" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row style="margin-top: 40px; text-align: center">
          <el-form :inline="true" class="form-inline">
            <el-form-item>
              <el-button type="info" plain @click="cancel">取消</el-button>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" :loading="isLoading" @click="save">提交</el-button>
            </el-form-item>
          </el-form>
        </el-row>
      </el-form>
    </div>
  </div>
</template>

<script>
import {
  MaterialDetail
} from "../../../../api/material.js";

export default {
  // 页面公共变量
  data() {
    return {
      isLoading: false,          // 是否显示加载框
      title: "化学吸附",         // 顶部标题
      form: {},                 // 详情内容
    };
  },
  // 页面创建完成事件
  async created() {
    this.title = this.$t('common.title.chemisorption');

    // 获取详情数据
    await this.getDataInfo(id);
  },
  // 页面相关方法
  methods: {
    // 获取详情数据
    async getDataInfo(id) {
      // // 获取详情数据
      // const { data } = await MaterialDetail({
      //   Id: id
      // });
      // if (data) {
      //   // 设置表单数据
      //   this.form = data;
      // }
    },
    // 保存数据事件
    save() {
      this.$message({ type: 'success', message: '提交成功' });
      this.$router.back();
    },
    // 返回事件
    cancel() {
      this.$router.back();
    },
  },
};
</script>

<style lang="scss" scoped>
// 区域标题样式
.titie-bar {
  width: 4px;
  height: 32px;
  border-radius: 2px;
  background-color: rgba(61, 171, 175, 1);
  margin: 5px 0 5px 0;
}
.titie-bar span {
  color: #0A0A0A;
  width: 80px;
  font-size: 22px;
  line-height: 32px;
  white-space: nowrap;
  overflow-wrap: break-word;
  margin-left: 15px;
}
</style>
